<template>
	<view>
		<!-- 简约风格 -->
		<kz-page-my-simple :user="user" @login="login" @goTo="goTo" @clearStorage="clearStorage" v-if="pageStyle == 'simple'"></kz-page-my-simple>

		<!-- 多彩风格 -->
 		<kz-page-my-color :user="user" @login="login" @goTo="goTo" @clearStorage="clearStorage" v-else-if="pageStyle == 'color'"></kz-page-my-color>

		<!-- 流量主组件 -->
		<!-- #ifdef MP-WEIXIN -->
		<kz-ad ref="adMy" kind="BANNER" :config="ad" field="my_banner"></kz-ad>
		<kz-ad ref="adMy" kind="VIDEO" :config="ad" field="my_video"></kz-ad>
		<kz-ad ref="adMy" kind="VIDEO_PATCH" :config="ad" field="my_video_patch"></kz-ad>
		<!-- #endif -->

		<!-- 大嘴鸟组件 -->
		<monster v-if="showMonster"></monster>

		<login ref="login" v-on:succ="ajax"></login>
		<tabbar></tabbar>
	</view>
</template>

<script>
import userApi from "@/common/api/user.js"
import { nextTick } from "vue";

	export default {
		data() {
			return {
				imgUrl: this.url,
				user: null,
				ad: {},
				pageStyle: 'simple',
				showMonster: false,
				isLogin : false

			};
		},
		onLoad() {
			this.ad = this.utils.getData('ad')
			// 插屏广告
			if (this.ad.my_cp_open == 1) {
				this.adUtils.interstitial.load(this.ad.my_cp)
				this.adUtils.interstitial.show()
			}

			let page = this.utils.getData('page')
			if (page) {
				// 页面风格
				this.pageStyle = page.page_my_style ? page.page_my_style : 'simple'
				// 大嘴鸟
				this.showMonster = page.page_my_monster_btn == 1
			}


		},
		onShow() {
			uni.$on('login_success', (data) => {
				console.log('login_success', data)
				this.user = data.user
				this.ajax()
			})
			this.ajax()
			if(uni.getStorageSync('token')){
				this.isLogin = true
			}else{

			this.$nextTick(()=>{
				 console.log(this.$refs.login)
				 this.$refs.login.modal = true;
			})

			}
		},
		onHide() {
			uni.$off('login_success')
		},
		methods: {
			ajax() {
				if (uni.getStorageSync('token')) {
					userApi.getUserInfo(this).then(res => {
						if (res.code == 1) {
							this.user = res.data
							uni.setStorageSync('user', this.user)
						} else {
							uni.$emit('uniLogin')
						}
					})
				} else {
					uni.$emit('uniLogin')
				}

				// setTimeout(() => {
				// 	this.user = uni.getStorageSync('user')
				// 	console.log('user', this.user)
				// }, 500)
			},
			login() {
				console.log('on login')
				if (!uni.getStorageSync('token')) {
					this.$refs.login.modal = true;
					return;
				} else {
					uni.navigateTo({
						url: 'set'
					});
				}
			},
			goTo(page) {
				console.log('page', page)
				if (!uni.getStorageSync('token')) {
					this.$refs.login.modal = true;
					return;
				} else {
					this.utils.goto(page)
					// uni.navigateTo({
					// 	url: page
					// 	// url: e.currentTarget.dataset.url
					// });
				}
			},
			clearStorage() {
				console.log('on clearStorage')
				uni.showModal({
					title: '提醒',
					content: '是否确认要清理缓存吗？（将清理用户登录信息及练题记忆模式等数据）',
					confirmColor: '#4A90E2',
					success: (t) => {
						t.confirm ?
							(uni.showLoading({
									title: '正在清除缓存...',
									mask: !0
								}),
								uni.clearStorage({
									success: () => {
										this.user = null
										uni.setStorageSync('user', '');
										uni.setStorageSync('user_id', '');
										uni.setStorageSync('openid', '');
									},
									fail: (t) => {
										console.log('fail');
									},
									complete: function(t) {
										setTimeout(function() {
											uni.hideLoading();
										}, 1000);
									}
								})) :
							t.cancel && console.log('取消');
					}
				});
			},
			tel() {
				uni.makePhoneCall({
					phoneNumber: this.copyright_mobile
				});
			}
		}
	};
</script>

<style>
	page {
		/* background-color: #fff; */
	}
</style>
